<!DOCTYPE html>
<html lang="en">
<head>
    <title>首页</title>
    <link rel="stylesheet" href="/static/css/main-page/g-reset.css" />
    <script src="/webjars/miniui/boot.js" type="text/javascript"></script>
    <script src="/static/js/common/common.js" type="text/javascript"></script>
    <link href="/static/css/main-page/home.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="/static/js/main-page/echarts.min.js"></script>
    <style>
        body {
            height:100%;
            background:transparent;
        }
        .home-page {
            width:100%;
            height:100%;
        }
    </style>

</head>
<body>
<div class="home-page">
    <div class="home-left fl">
        <ul>
            <li class="home-region" style="margin-top:5%;">
                <div class="region-content ">
                    <ul class="clearfix completedBox">
                        <div id="div1" style="height: 100%;width: 100%;"></div>
                    </ul>
                </div>
            </li>
            <li class="home-region" style="margin-top:5%;">
                <div class="region-content ">
                    <ul class="clearfix completedBox">
                        <div id="div3" style="height: 100%;width: 100%;"></div>
                    </ul>
                </div>
            </li>
            <li class="home-region" style="margin-top:5%;">
                <div class="region-content ">
                    <ul class="clearfix completedBox">
                        <div id="div5" style="height: 100%;width: 100%;"></div>
                    </ul>
                </div>
            </li>
        </ul>
    </div>
    <div class="home-right fr">
        <ul>
            <li class="home-region" style="margin-top:3.5%;">
                <div class="region-content">
                    <ul class="clearfix">
                        <div id="div2" style="height: 100%;width: 100%;"></div>
                    </ul>
                </div>
            </li>
            <li class="home-region" style="margin-top:3.5%;">
                <div class="region-content">
                    <ul class="clearfix">
                        <div id="div4" style="height: 100%;width: 100%;"></div>
                    </ul>
                </div>
            </li>
            <li class="home-region" style="margin-top:3.5%;">
                <div class="region-content">
                    <ul class="clearfix">
                        <div id="div6" style="height: 100%;width: 100%;"></div>
                    </ul>
                </div>
            </li>
        </ul>
    </div>
</div>
<script type="text/javascript">
    $(function () {
        mini.parse();
        var div1 = echarts.init(document.getElementById('div1'));
        var div2 = echarts.init(document.getElementById('div2'));
        var div3 = echarts.init(document.getElementById('div3'));
        var div4 = echarts.init(document.getElementById('div4'));
        var div5 = echarts.init(document.getElementById('div5'));
        var div6 = echarts.init(document.getElementById('div6'));
        var month = [], yearCount = [], lastYearCount = [], ratioYear = [], ratioMonth = [], countSum = [];
        var maxPopulation = [], halve = []
        $.ajax({
            url: "/main/chart1",
            type: "GET",
            dataType: "json",
            success: function (data) {
                if (data) {
                    month = mini.decode(data.month);
                    yearCount = mini.decode(data.yearCount);
                    lastYearCount = mini.decode(data.lastYearCount);
                    ratioYear = mini.decode(data.ratioYear);
                    ratioMonth = mini.decode(data.ratioMonth);
                    countSum = mini.decode(data.countSum);
                    maxPopulation = mini.decode(data.maxPopulation)
                    halve = mini.decode(data.halve)
                    chart_load1();
                }
            }
        });

        $.ajax({
            url: "/main/chart2",
            type: "GET",
            dataType: "json",
            success: function (data) {
                if (data) {
                    month = mini.decode(data.month);
                    yearCount = mini.decode(data.yearCount);
                    lastYearCount = mini.decode(data.lastYearCount);
                    ratioYear = mini.decode(data.ratioYear);
                    ratioMonth = mini.decode(data.ratioMonth);
                    countSum = mini.decode(data.countSum);
                    maxPopulation = mini.decode(data.maxPopulation)
                    halve = mini.decode(data.halve)
                    chart_load2();
                }
            }
        });

        $.ajax({
            url: "/main/chart3",
            type: "GET",
            dataType: "json",
            success: function (data) {
                if (data) {
                    month = mini.decode(data.month);
                    yearCount = mini.decode(data.yearCount);
                    lastYearCount = mini.decode(data.lastYearCount);
                    ratioYear = mini.decode(data.ratioYear);
                    ratioMonth = mini.decode(data.ratioMonth);
                    countSum = mini.decode(data.countSum);
                    maxPopulation = mini.decode(data.maxPopulation)
                    halve = mini.decode(data.halve)
                    chart_load3();
                }
            }
        });


        $.ajax({
            url: "/main/chart4",
            type: "GET",
            dataType: "json",
            success: function (data) {
                if (data) {
                    month = mini.decode(data.month);
                    yearCount = mini.decode(data.yearCount);
                    lastYearCount = mini.decode(data.lastYearCount);
                    ratioYear = mini.decode(data.ratioYear);
                    ratioMonth = mini.decode(data.ratioMonth);
                    countSum = mini.decode(data.countSum);
                    maxPopulation = mini.decode(data.maxPopulation)
                    halve = mini.decode(data.halve)
                    chart_load4();
                }
            }
        });


        $.ajax({
            url: "/main/chart5",
            type: "GET",
            dataType: "json",
            success: function (data) {
                if (data) {
                    month = mini.decode(data.month);
                    yearCount = mini.decode(data.yearCount);
                    lastYearCount = mini.decode(data.lastYearCount);
                    ratioYear = mini.decode(data.ratioYear);
                    ratioMonth = mini.decode(data.ratioMonth);
                    countSum = mini.decode(data.countSum);
                    maxPopulation = mini.decode(data.maxPopulation)
                    halve = mini.decode(data.halve)
                    chart_load5();
                }
            }
        });


        $.ajax({
            url: "/main/chart6",
            type: "GET",
            dataType: "json",
            success: function (data) {
                if (data) {
                    month = mini.decode(data.month);
                    yearCount = mini.decode(data.yearCount);
                    lastYearCount = mini.decode(data.lastYearCount);
                    ratioYear = mini.decode(data.ratioYear);
                    ratioMonth = mini.decode(data.ratioMonth);
                    countSum = mini.decode(data.countSum);
                    maxPopulation = mini.decode(data.maxPopulation)
                    halve = mini.decode(data.halve)
                    chart_load6();
                }
            }
        });

        function chart_load1() {
            option1 = {
                title: {text: '安置帮教对象总数'},
                tooltip: {
                    trigger: 'axis'
                },
                toolbox: {},
                legend: {
                    data: ['近一年数量', '上一年数量', '同比比率', '环比比率'],
                    left: 200
                },
                xAxis: [
                    {
                        type: 'category',
                        data: month,
                        axisPointer: {
                            type: 'shadow'
                        }
                    }
                ],
                yAxis: [
                    {
                        type: 'value',
                        name: '人数',
                        min: 0,
                        max: maxPopulation,
                        interval: halve,
                        axisLabel: {
                            formatter: '{value} '
                        }
                    },
                    {
                        type: 'value',
                        name: '比率',
                        min: 0,
                        max: maxPopulation,
                        interval: halve,
                        axisLabel: {
                            formatter: '{value}%'
                        }
                    }
                ],
                series: [
                    {
                        name: '近一年数量',
                        type: 'bar',
                        data: yearCount
                    },
                    {
                        name: '上一年数量',
                        type: 'bar',
                        data: lastYearCount
                    },
                    {
                        name: '同比比率',
                        type: 'line',
                        yAxisIndex: 1,
                        data: ratioMonth
                    },
                    {
                        name: '环比比率',
                        type: 'line',
                        yAxisIndex: 1,
                        data: ratioYear
                    }
                ]
            };
            div1.setOption(option1);
        }

        function chart_load2() {
            option2 = {
                title: {text: '安置帮教对象总数'},
                tooltip: {
                    trigger: 'axis'
                },
                toolbox: {},
                legend: {
                    data: ['近一年数量', '上一年数量', '同比比率', '环比比率'],
                    left: 200
                },
                xAxis: [
                    {
                        type: 'category',
                        data: month,
                        axisPointer: {
                            type: 'shadow'
                        }
                    }
                ],
                yAxis: [
                    {
                        type: 'value',
                        name: '人数',
                        min: 0,
                        max: maxPopulation,
                        interval: halve,
                        axisLabel: {
                            formatter: '{value} '
                        }
                    },
                    {
                        type: 'value',
                        name: '比率',
                        min: 0,
                        max: maxPopulation,
                        interval: halve,
                        axisLabel: {
                            formatter: '{value}%'
                        }
                    }
                ],
                series: [
                    {
                        name: '近一年数量',
                        type: 'bar',
                        data: yearCount
                    },
                    {
                        name: '上一年数量',
                        type: 'bar',
                        data: lastYearCount
                    },
                    {
                        name: '同比比率',
                        type: 'line',
                        yAxisIndex: 1,
                        data: ratioMonth
                    },
                    {
                        name: '环比比率',
                        type: 'line',
                        yAxisIndex: 1,
                        data: ratioYear
                    }
                ]
            };
            div2.setOption(option2);
        }

        function chart_load3() {
            option3 = {
                title: {text: '安置帮教对象总数'},
                tooltip: {
                    trigger: 'axis'
                },
                toolbox: {},
                legend: {
                    data: ['近一年数量', '上一年数量', '同比比率', '环比比率'],
                    left: 200
                },
                xAxis: [
                    {
                        type: 'category',
                        data: month,
                        axisPointer: {
                            type: 'shadow'
                        }
                    }
                ],
                yAxis: [
                    {
                        type: 'value',
                        name: '人数',
                        min: 0,
                        max: maxPopulation,
                        interval: halve,
                        axisLabel: {
                            formatter: '{value} '
                        }
                    },
                    {
                        type: 'value',
                        name: '比率',
                        min: 0,
                        max: maxPopulation,
                        interval: halve,
                        axisLabel: {
                            formatter: '{value}%'
                        }
                    }
                ],
                series: [
                    {
                        name: '近一年数量',
                        type: 'bar',
                        data: yearCount
                    },
                    {
                        name: '上一年数量',
                        type: 'bar',
                        data: lastYearCount
                    },
                    {
                        name: '同比比率',
                        type: 'line',
                        yAxisIndex: 1,
                        data: ratioMonth
                    },
                    {
                        name: '环比比率',
                        type: 'line',
                        yAxisIndex: 1,
                        data: ratioYear
                    }
                ]
            };
            div3.setOption(option3);
        }

        function chart_load4() {
            option4 = {
                title: {text: '安置帮教对象总数'},
                tooltip: {
                    trigger: 'axis'
                },
                toolbox: {},
                legend: {
                    data: ['近一年数量', '上一年数量', '同比比率', '环比比率'],
                    left: 200
                },
                xAxis: [
                    {
                        type: 'category',
                        data: month,
                        axisPointer: {
                            type: 'shadow'
                        }
                    }
                ],
                yAxis: [
                    {
                        type: 'value',
                        name: '人数',
                        min: 0,
                        max: maxPopulation,
                        interval: halve,
                        axisLabel: {
                            formatter: '{value} '
                        }
                    },
                    {
                        type: 'value',
                        name: '比率',
                        min: 0,
                        max: maxPopulation,
                        interval: halve,
                        axisLabel: {
                            formatter: '{value}%'
                        }
                    }
                ],
                series: [
                    {
                        name: '近一年数量',
                        type: 'bar',
                        data: yearCount
                    },
                    {
                        name: '上一年数量',
                        type: 'bar',
                        data: lastYearCount
                    },
                    {
                        name: '同比比率',
                        type: 'line',
                        yAxisIndex: 1,
                        data: ratioMonth
                    },
                    {
                        name: '环比比率',
                        type: 'line',
                        yAxisIndex: 1,
                        data: ratioYear
                    }
                ]
            };
            div4.setOption(option4);
        }

        function chart_load5() {
            option5 = {
                title: {text: '安置帮教对象总数'},
                tooltip: {
                    trigger: 'axis'
                },
                toolbox: {},
                legend: {
                    data: ['近一年数量', '上一年数量', '同比比率', '环比比率'],
                    left: 200
                },
                xAxis: [
                    {
                        type: 'category',
                        data: month,
                        axisPointer: {
                            type: 'shadow'
                        }
                    }
                ],
                yAxis: [
                    {
                        type: 'value',
                        name: '人数',
                        min: 0,
                        max: maxPopulation,
                        interval: halve,
                        axisLabel: {
                            formatter: '{value} '
                        }
                    },
                    {
                        type: 'value',
                        name: '比率',
                        min: 0,
                        max: maxPopulation,
                        interval: halve,
                        axisLabel: {
                            formatter: '{value}%'
                        }
                    }
                ],
                series: [
                    {
                        name: '近一年数量',
                        type: 'bar',
                        data: yearCount
                    },
                    {
                        name: '上一年数量',
                        type: 'bar',
                        data: lastYearCount
                    },
                    {
                        name: '同比比率',
                        type: 'line',
                        yAxisIndex: 1,
                        data: ratioMonth
                    },
                    {
                        name: '环比比率',
                        type: 'line',
                        yAxisIndex: 1,
                        data: ratioYear
                    }
                ]
            };
            div5.setOption(option5);
        }

        function chart_load6() {
            option6 = {
                title: {text: '安置帮教对象总数'},
                tooltip: {
                    trigger: 'axis'
                },
                toolbox: {},
                legend: {
                    data: ['近一年数量', '上一年数量', '同比比率', '环比比率'],
                    left: 200
                },
                xAxis: [
                    {
                        type: 'category',
                        data: month,
                        axisPointer: {
                            type: 'shadow'
                        }
                    }
                ],
                yAxis: [
                    {
                        type: 'value',
                        name: '人数',
                        min: 0,
                        max: maxPopulation,
                        interval: halve,
                        axisLabel: {
                            formatter: '{value} '
                        }
                    },
                    {
                        type: 'value',
                        name: '比率',
                        min: 0,
                        max: maxPopulation,
                        interval: halve,
                        axisLabel: {
                            formatter: '{value}%'
                        }
                    }
                ],
                series: [
                    {
                        name: '近一年数量',
                        type: 'bar',
                        data: yearCount
                    },
                    {
                        name: '上一年数量',
                        type: 'bar',
                        data: lastYearCount
                    },
                    {
                        name: '同比比率',
                        type: 'line',
                        yAxisIndex: 1,
                        data: ratioMonth
                    },
                    {
                        name: '环比比率',
                        type: 'line',
                        yAxisIndex: 1,
                        data: ratioYear
                    }
                ]
            };
            div6.setOption(option6);
        }
        if(!window.localStorage.getItem('storge')){
            mini.alert('缓存数据过多会造成系统异常，建议您及时清理浏览器缓存！');
            window.localStorage.setItem('storge','true')
        }
    });
</script>
</body>
</html>